import type { RouteObject } from 'react-router-dom';
import type { ReactNode } from 'react';
import MainLayout from '../layouts/MainLayout';
import { UserOutlined, HomeOutlined, DeploymentUnitOutlined } from '@ant-design/icons';

// 页面
import Home from '../pages';
import About from '../pages/about';
import Service from '../pages/service';
import View from '../pages/view';

// 扩展路由类型，添加菜单元数据
export interface RouteMeta {
  label: string;
  icon?: ReactNode;
  hidden?: boolean; // 是否在菜单中隐藏
}

export interface ExtendedRouteObject extends Omit<RouteObject, 'children'> {
  meta?: RouteMeta;
  children?: ExtendedRouteObject[];
}

// 路由配置 - 集中管理所有路由
// 添加新路由时，只需在此文件中添加 path、element 和 meta 即可
export const routes: ExtendedRouteObject[] = [
  {
    element: <MainLayout />,
    children: [
      {
        path: '/',
        element: <Home />,
        meta: {
          label: '首页',
          icon: <HomeOutlined />,
        },
      },
      {
        path: '/about',
        element: <About />,
        meta: {
          label: '关于',
          icon: <UserOutlined />,
        },
      },
      {
        path: '/service',
        element: <Service />,
        meta: {
          label: '服务支持',
          icon: <DeploymentUnitOutlined />,
        },
      },
      {
        path: '/view',
        element: <View/>,
        meta: {
          label: '视图',
          icon: <DeploymentUnitOutlined />,
        }
      }
    ],
  },
];

// 类型断言：将扩展的路由配置转换为 RouteObject[] 供 React Router 使用
export const routerRoutes: RouteObject[] = routes as RouteObject[];

